import Cookie from "js-cookie";
export default {
  state: {
    //折叠菜单
    isCollapse: false,
    // 全部菜单
    menu: [],
    // 面包屑联动
    currentMenu: null,
    // tag标签
    tagList: [
      {
        path: "/",
        name: "home",
        label: "首页",
        icon: "home",
      },
    ],
  },
  mutations: {
    //选择左侧菜单触发的事件
    selectMenu(state, val) {
      //先判断是否存在在赋值
      if (state.name !== "home") {
        // 面包屑联动
        state.currentMenu = val;
        // tag标签联动
        var res = state.tagList.findIndex((item) => item.name === val.name); //不存在就返回-1  存在就返回指定的索引
        res === -1 ? state.tagList.push(val) : "";
      } else {
        state.currentMenu = nul;
      }
      // state.name !== 'home'? (state.currentMenu = val) : (state.currentMenu = null)
    },

    //关闭tab标签
    closeList(state, val) {
      //根据相对的索引 进行删除
      var index = state.tagList.findIndex((item) => item.name === val.name); //相对就返回对应的索引 进行删除
      state.tagList.splice(index, 1);
    },
    //更改折叠菜单的值
    collapseMenu(state) {
      state.isCollapse = !state.isCollapse;
    },
    // 设置菜单方法// 动态路由设置
    setMenu(stata, val) {
      stata.menu = val;
      // 存储cookie 就是把菜单传入进去
      Cookie.set("menu", JSON.stringify(val));
    },
    // 清除cookid 退出功能
    clearMenu(state) {
      state.menu = []
      Cookie.remove('menu')
    },
    // 动态添加菜单
    addMenu(state, router) {
      // 查看是否存在 在进行数据的替换
      if (!Cookie.get("menu")) {
        return;
      }
      //  字符串转json格式 把获取到的cookie 保存到menu 避免刷新的时候 数据丢失
      let menu = JSON.parse(Cookie.get("menu"));
      state.menu = menu;
      //  添加一个动态路由的数组
      let currentMenu = [
        {
          // 静态的就直接写死 动态的获取数据在进行拼接
          path: "/",
          component: () => import("views/Main.vue"),
          // 动态添加的路由都放到childran里面
          children: [],
        },
      ];
      // 通过循环来拼接 路由
      // 通过判断有children 或者没有children  就是子页面
      menu.forEach((item) => {
        if (item.children) {
          item.children = item.children.map((item) => {
            item.component = () => import(`@/views/${item.url}`);
            return item;
          });
          // 需要chidran添加动态路由 对数组进行展示 [1,2] [3,4] 展开后 [1234]
          currentMenu[0].children.push(...item.children);
        } else {
          item.component = () => import(`@/views/${item.url}`);
          currentMenu[0].children.push(item);
        }
      });
      router.addRoutes(currentMenu);
    },
  },
  actions: {},
};
